<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
        <title>Neovim from SurfingKeys</title>
        <link rel="stylesheet" href="../content.css">
        <style>
#overlay {
    position: fixed;
    left: 20%;
    top: 20%;
    width: 50%;
    max-height: 50%;
    padding: 5%;
    background: #fafafa;
    box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.8);
    z-index: 10;
    display: none;
}
#background {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #0e0e0ede;
    z-index: 9;
    display: none;
}
body.neovim-disabled>#overlay, body.neovim-disabled>#background {
    display: block;
}
kbd {
    white-space: nowrap;
    display: inline-block;
    padding: 3px 5px;
    vertical-align: middle;
    border: solid 1px #ccc;
    border-bottom-color: #bbb;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 #bbb;
}
        </style>
    </head>
    <body>
        <div id="overlay">
            <h1>Welcome to use neovim frontend from Surfingkeys, use <kbd>i</kbd> or <kbd>Alt-i</kbd> to enter Neovim, where you can use <kbd>Alt-i</kbd> to leave Neovim.</h1>

            Neovim UI is suspended, you can use shortcuts from Surfingkeys now, such as <kbd>E</kbd> <kbd>R</kbd> to switch to other tab, or <kbd>t</kbd> to open Omnibar.
        </div>
        <div id="background"></div>
        <script src="neovim.js"></script>
        <script src="../content.js"></script>
    </body>
</html>
